<template>
    <div>
        <breadcrumb :routerList="routerList"></breadcrumb>
        <el-button type="primary" icon="el-icon-plus" @click="newClassClick">新增供货商</el-button>
        <supplierTable :supplierList="supplierList" @refreshTableFun="refreshTableFun"></supplierTable>
        <paginationAre :total="total" @currentChange="currentChange"></paginationAre>
    </div>
</template>

<script>
    import breadcrumb from '@/components/breadcrumb.vue'
    import supplierTable from '@/components/supplierTable.vue'
    import paginationAre from '@/components/paginationAre.vue'


    export default {
        components: {breadcrumb,supplierTable,paginationAre},
        data(){
            return {
                routerList: [
                    {
                        name: '供货商列表',
                        path: ''
                    },
                ],
                supplierList: [],
                page:1,
                total:0
            }
        },
        created(){
            this.getSupplierList()
        },
        methods:{
            async getSupplierList(){
                let res = await this.$Http.getSupplier(
                    {
                        p:this.page,
                        num:this.$store.state.pageNum
                    }
                )
                console.log(res)
                if(res.length!=0){
                    this.supplierList = res.list
                    this.total = Number(res.count)
                }
            },
            currentChange(currentPage){
                this.page = currentPage
                this.getSupplierList()
            },
            newClassClick(){
                this.$router.push({
                    path: '/newSupplier',
                    query: {type: 1,list: ''}
                })
            },
            refreshTableFun(){
                this.getSupplierList()
            }
        }
    }
</script>

<style>
    .el-button{
        margin: 20px 0;
    }
</style>
